@import "_color";
@import "_common";

html, body {
  background-color: $bgcolor;
}

#app {
  position: relative;
}

.bamboo-app {
  position: relative;
  display: flex;
  display: -webkit-flex;
}

.bamboo-right {
  position: absolute;
  top: 4rem;
  left: 12rem;
  right: 0;
}

.scrollbar-macosx {
  width: 100%;
}

// .btn-danger {
//     padding: 3.5px 8px;
// }
.bamboo-nav {
  // background-color: $white;
  padding: 1.5rem .8rem .8rem;
  font-size: 1.1rem;
  color: $gray-color;
  // border-bottom: solid 1px $border-color;
  // position: sticky;
  // top: 0rem;
  // z-index: 10;
}

.bamboo-switch-icon {
  width: 3.3rem;
  height: auto;
  border-radius: 0;
  &:hover {
    cursor: pointer;
  }
}

.bamboo-btn-green {
  width: 6rem;
  height: 2.4rem;
  line-height: 2.4rem;
  text-align: center;
  color: $green;
  display: inline-block;
  font-size: 1rem;
  border-radius: 4px;
  border: solid 1px $green;
  &:hover,  &:focus, &:active {
    color: $white;
    background-color: $green;
  }
}

.bamboo-btn-red {
  width: 6rem;
  height: 2.4rem;
  line-height: 2.4rem;
  text-align: center;
  background-color: $green;
  color: $white;
  display: inline-block;
  font-size: 1rem;
  border-radius: 4px;
  &:hover,  &:focus, &:active {
    color: $white;
    background-color: $green;
  }
}

.xlb-data-page {
  margin: 1.8rem 0rem;
  > div {
    > a {
      margin-right: .8rem;
      border: none;
      outline: none;
      &:nth-child(1) {
        background-color: $green-one;
      }
      &:nth-child(2) {
        background-color: $yellow;
      }
    }
  }
}

.btn-sm {
  width: 5rem;
  height: 1.8rem;
  line-height: 1.2rem;
  font-size: .95rem;
}

.form-control {
  border: solid 1px #e0e0e0;
  box-shadow: none;
  border-radius: 0px;
  height: 36px;
  @include style-transition;
}

.form-control:focus {
  border-color: $green;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.bamboo-table {
  border: solid 1px $border-color;
  width: 100%;
  margin: 1.3rem 0;
  tr {
    th {
      border-bottom: solid 1px $border-color;
      border-right: solid 1px $border-color;
      padding: .65rem .5rem;
      font-size: 1rem;
      background: rgba(46,103,247, 0.15);
      color: #2e67f7;
      font-weight: 500;
    }
    td {
      border-bottom: solid 1px $border-color;
      border-right: solid 1px $border-color;
      padding: .55rem .5rem;
      font-size: 1rem;
      color: $gray-one;
    }
  }
  tbody {
    tr {
      @include style-transition;
      &:hover {
        background-color: #f6f8f9;
      }
      .bamboo-content-control {
        a {
          margin-left: 0px;
          margin-right: 1.5rem;
        }
      }
    }
  }
}

.bamboo-project-setting {
  > div {
    > a {
      text-decoration: underline;
    }
  }
  > div {
    > h3 {
      font-size: 1.3rem;
      margin-top: 2rem;
      margin-bottom: 1.5rem;
    }
    > div {
      margin-bottom: 1rem;
      > span {
        width: 6rem;
        display: inline-block;
      }
      > input {
        width: 20rem;
        display: inline-block;
      }
      select {
        background:#f3f3f3;
        border-radius:4px;
        width:160px;
        height:30px;
        border: none;
        outline: none;
        margin-right: 15px;
        font-size:12px;
        color:#555;
        letter-spacing:0;
        text-align:left;
        padding: 0 15px;
        &:hover, &:focus, &:active {
          border: none;
          outline: none;
        }
      }
      > a {
        margin-top: 2.5rem;
      }
    }
  }
}

.select-class {
  background:#f3f3f3;
  border-radius:4px;
  width:160px;
  height:30px;
  border: none;
  outline: none;
  margin-right: 15px;
  font-size:12px;
  color:#555;
  letter-spacing:0;
  text-align:left;
  padding: 0 15px;
  &:hover, &:focus, &:active {
    border: none;
    outline: none;
  }
}


@import "_scroll";
@import "_header";
@import "_left";
@import "_login";
@import "_column";
@import "_content";
@import "_articles";
@import "_user";
